<div class="pull-right">
  <button class="btn btn-success" ng-if="openNotificationAmount()" ng-click="sendCurrentNotifcation()">Send Current Notification Queue</button>
  <button class="btn btn-success" ng-click="openNotificationModal()">Add to Email-Notification</button>
</div>

<h1>Notification Queue</h1>

<div class="spinner big" ng-show="loading">
  <div class="bounce1"></div>
  <div class="bounce2"></div>
  <div class="bounce3"></div>
</div>


<hr/>

<p>This page can be used to send notifications about what you have uploaded to other users.</p>
<p>Use the Add Notification button inside a Movie's or a TV Show's information page to add to this queue.</p>

<table class="table table-striped">
  <thead>
    <tr>
      <td>date Created</td>
      <td>movie / tv Show</td>
      <td>Description</td>
      <td>is Completed</td>
      <td></td>
    </tr>
  </thead>
  <tr ng-repeat="notification in notifications | orderBy: '-dateCreated'" ng-class="{'fade-50': notification.isCompleted}">
    <td>{{notification.dateCreated | date:'short'}}</td>
    <td ng-if="notification.movie">
      <img ng-if="notification.movie.poster_path" ng-src="{{notification.movie.poster_path}}" style="max-width: 50px; margin-right: 10px;"/>
      {{notification.movie.title}} ({{notification.movie.release_date.substring(0,4)}})
    </td>
    <td ng-if="notification.tvShow">
      <img ng-if="notification.tvShow.poster_path" ng-src="{{notification.tvShow.poster_path}}" style="max-width: 50px; margin-right: 10px;"/>
      {{notification.tvShow.name}} ({{notification.tvShow.first_air_date.substring(0,4)}})
    </td>
    <td>{{notification.description}}</td>
    <td style="width: 117px;" class="text-center">
      <i class="ion-ios-checkmark text-success" ng-if="notification.isCompleted" style="font-size: 42px; line-height: 1.7em;"></i>
    </td>
    <td style="width: 1px;">
      <button class="btn btn-xs btn-danger" ng-click="delete(notification)">delete</button>
    </td>
  </tr>
</table>


